<template>
	<div class="heders">
		<nav>
			<router-link 
				tag="span"
				v-for="item in  navlist"
				:to="item.path"
				active-class="active"
			>
			{{item.name}}	
			</router-link>
		</nav>
	</div>
</template>
<script type="text/javascript">
	export default {
		name:'header',
		data(){
			return{
				navlist:[
					{
						name:'关注',
						path:'/PlateAll/CollectAll'
					},
					{
						name:'全部',
						path:'/PlateAll/BourseAll'
					}
				]
			}
		}
	}
</script>
<style scoped>
	.heders{
		width: 100%;
		background-color: #db2023;
		position: fixed;
		top: 0;
		left: 0;
		z-index: 100;
	}
	nav{
		width: 100%;
		text-align: center;
		height: 1.2rem;

	}
	nav span{
		font-size: 0.48rem;
		color: #fff;
		padding:0.18rem 0.24rem;
		margin-top: 0.1333333333rem;
		display: inline-block;
		margin: 0 0.18rem;
	}
	nav span.active{
		border-bottom: 0.08rem solid #fff;
	}
	


</style>